<script setup>
import useStore from '../store';
// 导入store对象, 模块化要按需导入
 const {todos} = useStore()
</script>
<template>
  <footer class="footer">
   <span class="todo-count">
  <strong>{{ todos.leftCount }}</strong> item left
</span>
   <ul class="filters">
  <li
    v-for="item in todos.filters"
    :key="item"
    @click="todos.changeActive(item)"
  >
    <a :class="{ selected: item === todos.active }" href="#/">{{ item }}</a>
  </li>
</ul>
    <button @click="todos.clearTodo" class="clear-completed">清除已完成</button>
  </footer>
</template>

<style lang="less" scoped></style>
